<template>
  <div style="height: 500px; overflow: scroll;">
    <i-button type="primary" @click="addTableRow">新增管理员</i-button>
    <i-button type="error" @click="deleteSelectRow">批量删除</i-button>
    <Table stripe border ref="selection" @on-selection-change="handleSelectRow()" style="position:relative; margin: 20px auto;" :columns="columns" :data="currentData"></Table>
    <Page show-elevator :total="dataCount" :pageSize="pageSize" :current="pageIndex" @on-change="changepage" @on-page-size-change="pagesize" style="text-align: right;"></Page>
    <Modal v-model="modal1" title="新增管理员" @on-ok="ok" @on-cancel="cancel">
      <div style="text-align: center;">
        添加Notes id
        <i-input v-model="value" placeholder="" style="width: 100px"></i-input>
        为管理员
      </div>
    </Modal>
  </div>
</template>

<script>
export default {
  data () {
    return {
      dataCount: [], // 初始化信息总条数
      pageSize: 6, // 每页条数
      modal1: false,
      params: {
        notesId: ''
      },
      columns: [
        // key里面的值和后台的字段相对应
        { type: 'selection', width: 60, align: 'center' }, // 这里是复选框
        { title: '系统编号', width: 100, key: 'sysuserno' },
        { title: '姓名', width: 100, key: 'userName' },
        { title: 'Notes ID', width: 100, key: 'notesId' },
        { title: '所属机构名称', width: 150, key: 'costCenter' },
        { title: '部门', width: 150, key: 'department' },
        //  后台获取得到的是数字，根据不同的数据显示不同的文字，
        //  render函数
        {
          title: '操作',
          render: (h, params) => {
            return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  style: {
                    margin: '3px'
                  },

                  on: {
                    click: () => {
                      console.log('delete')
                      console.log(this.currentData[params.index].notesId)
                      this.params.notesId = this.currentData[params.index].notesId
                      // 将需要删除的数据项传递到后端
                      this.$api.removeAdmin(this.params).then((res) => {
                        if (!res.error) {
                          console.log('delete success')
                        } else {
                          console.log(this.$Message.error(res.msg))
                          console.log('delete failed')
                        }
                      })
                      this.currentData.splice(params.index, 1) //  params.index 当前下标
                    }
                  }
                },
                '删除'
              )
            ])
          }
        }
      ],
      currentData: []
    }
  },
  methods: {
    isSuperAdmin (role) {
      if (role === '1') {
      } else {
        this.$router.push('/nopermission')
      }
    },
    /**
     * 刷新页面请求
    * */
    refresh () {
      this.getData()
    },
    /**
     * @params: state 用户状态
     * */
    getData () {
      console.log(this.$route.name)
      this.$api.getAdmin().then((res) => {
        if (!res.error) {
          this.currentData = res.data // 获得表格数据
          this.dataCount = res.dataCount // 获得总数据条数
        } else {
          console.log(this.$Message.error(res.msg))
        }
      })
    },
    handleSelectRow () {
      // 获取点击的这一行的数据(系统编号)
      const a = this.$refs.selection.getSelection()
      // console.log(a)
      var b = []
      var j = 0
      this.selectedNum = 0
      for (var i = 0; i < a.length; i++) {
        this.selectedid = a[i].sysuserno
        if (a.length > 1) {
          b[j] = this.selectedid
          j++
          this.selectedNum++
        } else {
          b = this.selectedid
        }
      }
      this.selectedid = b
      console.log(this.selectedid)
    },
    async deleteSelectRow () {
      var selected = []
      var n = 0
      for (var i = 0; i < this.currentData.length; i++) {
        for (var j = 0; j < this.selectedNum; j++) {
          // console.log(this.currentData[i].sysuserno)
          if (this.currentData[i].sysuserno === this.selectedid[j]) {
            selected[n] += this.currentData[i].notesId
            n++
            this.params.notesId = this.currentData[i].notesId
            await this.$api.removeAdmin(this.params).then((res) => {
              if (!res.error) {
                console.log('delete selected success')
              } else {
                console.log(this.$Message.error(res.msg))
                console.log('delete selected failed')
              }
            })
            this.currentData.splice(i, 1)
          }
        }
      }
      // 根据系统编号批量删除
    },
    addTableRow () {
      this.modal1 = true
    },
    ok () {
      this.$Message.info('确定')
      // 将需要新增的数据项传递到后端
      console.log(this.value)
      this.params.notesId = this.value
      this.$api.setAdmin(this.params).then((res) => {
        console.log(res)
        // 得到新增管理员的详细信息，添加到列表中
        this.currentData.push({
          notesId: res.data.notesId,
          userName: res.data.userName,
          costCenter: res.data.costCenter,
          sysuserno: res.data.sysuserno,
          department: res.data.department
        })
        if (!res.error) {
          console.log('add success')
        } else {
          console.log(this.$Message.error(res.msg))
          console.log('add failed')
        }
      })
    },
    cancel () {
      this.$Message.info('取消')
    },
    changepage (index) {
      var _start = (index - 1) * this.pageSize
      var _end = index * this.pageSize
      this.currentData = this.ajaxHistoryData.slice(_start, _end)
    }
  },
  created () {
    if (sessionStorage.managerType === '1') {
      this.$router.push('/nopermission')
    }
    this.getDataCount()
    this.isSuperAdmin(this.$route.role)
  },
  mounted () {
    this.refresh()
  }
}
</script>
<style>

</style>
